/**
 * Created by Ysssssss on 2021/5/21.
 */

import React, { PureComponent } from 'react'
import { Switch, Radio, InputNumber, Form } from "antd";
import {SHOPPING_MALL_BIZ_TYPE} from "@constants/ShoppingMallBizType";
import {MultiSelectStoreContainer} from "@common/presentational/MultiSelectModal";

class ShoppingMallSettings extends PureComponent {
    render () {
        const { bizType, isOpen } = this.props

        return (
            <>
                <div className="shopping-mall-mode">
                    当前商城：{ SHOPPING_MALL_BIZ_TYPE[bizType] }
                </div>
                <div className="shopping-mall-page">
                    <div className="shopping-mall-settings-page">
                        { bizType === 'agent' ? (
                            <>
                                <div className="ft-14 ft-clr-ml">经销商设置</div>
                                <div className="mgt-16 mgb-24">
                                    <Form.Item
                                        noStyle
                                        name='inventory_mode'
                                    >
                                        <Radio.Group>
                                            <Radio value={0}>统一由品牌仓发货</Radio>
                                            <Radio value={1}>统一由店铺仓自行发货</Radio>
                                            <Radio value={2} disabled={isOpen}>部分由店铺仓配送</Radio>
                                        </Radio.Group>
                                    </Form.Item>
                                </div>
                            </>
                        ) : null }
                        <Form.Item
                            noStyle
                            shouldUpdate={(prevValues, currentValues) => prevValues.inventory_mode !== currentValues.inventory_mode}
                        >
                            { ({getFieldValue}) => getFieldValue('inventory_mode') === 2 ? (
                                <Form.Item
                                    noStyle
                                    name="stores"
                                >
                                    <MultiSelectStoreContainer className="mgb-24"/>
                                </Form.Item>
                            ) : null}
                        </Form.Item>
                        <div className="ft-14 ft-clr-ml">预约设置</div>
                        <div className="mgt-16 flex-vertical-center" style={{height: '30px'}}>
                            <Form.Item
                                noStyle
                                name='allow_booking'
                                valuePropName="checked"
                            >
                                <Switch />
                            </Form.Item>
                            <Form.Item
                                noStyle
                                shouldUpdate={(prevValues, currentValues) => prevValues.allow_booking !== currentValues.allow_booking}
                            >
                                { ({getFieldValue}) => (
                                    <span className="mgl-16">{ getFieldValue('allow_booking') ? '已开启' : '未开启' }</span>
                                ) }
                            </Form.Item>
                            <Form.Item
                                noStyle
                                shouldUpdate={(prevValues, currentValues) => prevValues.allow_booking !== currentValues.allow_booking}
                            >
                                { ({getFieldValue}) => (
                                    <>
                                        <span className={`mgl-60${getFieldValue('allow_booking') ? '' : ' hidden'}`}>最多提前</span>
                                        <Form.Item
                                            name='booking_days'
                                            noStyle
                                            hidden={!getFieldValue('allow_booking')}
                                        >
                                            <InputNumber
                                                className="mgl-8 mgr-8"
                                                style={{width: '80px'}}
                                                min={1}
                                                max={30}
                                                precision={0}
                                                parser={value => value === '' ? 1 : value}
                                            />
                                        </Form.Item>
                                        <span className={getFieldValue('allow_booking') ? '' : 'hidden'}>天预约</span>
                                    </>
                                )}
                            </Form.Item>
                        </div>
                        <div className="ft-14 ft-clr-ml mgt-36">自动签收</div>
                        <div className="mgt-16 flex-vertical-center">
                            <span>确认发货</span>
                            <Form.Item
                                name='auto_confirmed_days'
                                noStyle
                            >
                                <InputNumber
                                    className="mgl-8 mgr-8"
                                    style={{width: '80px'}}
                                    min={15}
                                    max={30}
                                    precision={0}
                                    parser={value => value === '' ? 15 : value}
                                />
                            </Form.Item>
                            <span>天后客户未确认，系统自动签收</span>
                        </div>
                        <div className="ft-14 ft-clr-ml mgt-36">售后规则</div>
                        <div className="mgt-16 flex-vertical-center">
                            <span>确认收货</span>
                            <Form.Item
                                name='refund_allowed_days'
                                noStyle
                            >
                                <InputNumber
                                    className="mgl-8 mgr-8"
                                    style={{width: '80px'}}
                                    min={7}
                                    max={30}
                                    precision={0}
                                    parser={value => value === '' ? 7 : value}
                                />
                            </Form.Item>
                            <span>天后，客户不再允许申请售后 (退货/退款)</span>
                        </div>
                    </div>
                </div>
            </>
        )
    }
}

export default ShoppingMallSettings